<template>
	<view class="p-page p-status-page">
		<u-row>
			<u-col :span="4">
				私盘
			</u-col>
			<u-col :span="4">
				<u-switch v-model="tmp.propertyPermission" active-color="#FFD851" @change="changeSWitch"/>
			</u-col>
			<u-col :span="4">
				共有
			</u-col>
		</u-row>
		<view class="desc-area">
			<view> 关于共盘: </view>
			<view> 1.房源设置为共盘,审核通过后将不能返回设置为私盘; </view>
			<view> 2.共盘需上传该房源的房地产证审核， </view>
			<view> 且发布前，经纪人需通过实名认证。</view>
		</view>

		<u-radio-group v-model="tmp.cooperationType" v-if="tmp.propertyPermission">
			<u-radio name="0">各收各佣 </u-radio>
			<u-radio name="1"> 直对,佣金比例 <input class="small-input" v-model="tmp.cooperationProportion" @change="changeInput" /> %</u-radio>
			<u-radio name="2">直对,佣金金额 <input class="small-input" v-model="tmp.cooperationAmount" @change="changeInput" /> 元</u-radio>
		</u-radio-group>

		<view class="title"> 房源状态 </view>
		<u-radio-group v-model="tmp.feedbackType" @change="groupChange">
			<view class="flex al" v-if="render('state')">
				<u-radio name="2"> 在售 </u-radio>
				<u-radio name="3"> 已售 </u-radio>
			</view>
			<view class="flex al" v-if="!render('state')">
				<u-radio name="0"> 在租 </u-radio>
				<u-radio name="1"> 已租 </u-radio>
			</view>
		</u-radio-group>
	</view>
</template>

<script>
	export default {
		name: "we",
		data() {
			return {
				tmp: {},
			};
		},
		created() {
			var publishInfo = this.$store.state.publishInfo
			console.log(publishInfo);
			this.tmp = publishInfo;
			this.tmp.propertyPermission = this.tmp.propertyPermission?true:false; 
		},
		methods:{
			changeInput(){
				this.$store.dispatch("asyncPublishInfo", {  
					cooperationProportion: this.tmp.cooperationProportion ,
					cooperationAmount: this.tmp.cooperationAmount ,
			    });
			},
			changeSWitch(value){
				console.log(value);
				this.tmp.propertyPermission = value;
				this.$store.dispatch("asyncPublishInfo", {  propertyPermission: value });
			},
			groupChange(value){
				console.log(value);
				this.tmp.propertyStatus = value;
				this.$store.dispatch("asyncPublishInfo", { propertyStatus: value });
			}
		}
		
	}
</script>

<style lang="scss">
	.p-status-page {
		.desc-area {
			color: #ccc;
			font-size: 12px;
			margin: 20px 0;
		}

		.al {
			align-items: baseline;
		}

		.tip-area>view {
			margin: 5px 0;
		}

		.small-input {
			display: inline-flex;
			width: 80px;
			height: 18px;
			line-height: 30px;
			border: 1px solid #ccc;
			color: #ccc;
			text-align: center;
		}

		.flex {
			display: flex;
			margin: 5px 0;
			align-items: center;
		}

		.flex input {
			margin: 0 10px;
		}
	}
</style>
